<template>
    <div>
        <el-dialog
            :visible.sync="is_show"
            title="通过审核"
            width="500px"
            @closed="closed"
            center
        >
            <el-form
                :model="form"
                label-position="right"
                ref="form"
            >
                <el-form-item
                    prop="type"
                    label="兼职/全职"
                    label-width="125px"
                    :rules="{required: true, message: '域名不能为空', trigger: 'blur'}"
                >
                    <el-select v-model="form.type" placeholder="请选择兼职/全职">
                        <el-option value="兼职" label="兼职"></el-option>
                        <el-option value="全职" label="全职"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item
                    prop="email_work"
                    label="工作邮箱"
                    label-width="125px"
                    :rules="{required: true, message: '工作邮箱不能为空', trigger: 'blur'}"
                >
                    <el-input v-model="form.email_work" placeholder="请输入工作邮箱"></el-input>
                </el-form-item>
                <el-form-item
                    label="代理师资格证编号"
                    prop="certificate_number"
                    label-width="125px"
                >
                    <el-input v-model="form.certificate_number" placeholder="请输入代理师资格证编号"></el-input>
                </el-form-item>
            </el-form>
            <template slot="footer">
                <div class="tc">
                    <el-button type="danger" v-no-more-click:3000 @click="refused">拒绝申请</el-button>
                    <el-button type="primary" v-no-more-click:3000 @click="submit">通过申请</el-button>
                </div>
            </template>
        </el-dialog>
    </div>
</template>

<script>
export default {
    data() {
        return {
            is_show: false,
            form: {
                type: '兼职',
                email_work: '',
                certificate_number: ''
            },
            row: {}
        }
    },
    methods: {
        closed() {
            Object.assign(this.$data, this.$options.data())
            this.$refs['form'].resetFields()
        },
        showOn(data) {
            this.row = data
            this.is_show = true
        },
        submit() {
            if (this.form.email_work) {
                let reg = /^[A-Za-z0-9]+([_\.][A-Za-z0-9]+)*@([A-Za-z0-9\-]+\.)+[A-Za-z]{2,6}$/
                if (!reg.test(this.form.email_work)) {
                    return this.$message({
                        type: 'error',
                        message: '请输入正确的工作邮箱'
                    })
                }
            } else {
                return this.$message({
                    type: 'error',
                    message: '请输入工作邮箱'
                })
            }
            let html = `确定通过<span style="color: #67C23A">${this.row.name}</span>的代理人申请吗？`
            let params = Object.assign({}, this.form)
            if (!params.email_work) {
                delete params.email_work
            }
            if (!params.certificate_number) {
                delete params.certificate_number
            }
            this.$confirm(html, '提示', {
                confirmButtonText: '确认',
                cancelButtonText: '取消',
                center: true,
                dangerouslyUseHTMLString: true
            }).then(() => {
                this.$axios.put(`/api/agent/${this.row.id}/check`, params).then(res => {
                    if (res.data.code == 200) {
                        this.$emit('refresh')
                        this.is_show = false
                        this.$message({
                            message: '操作成功',
                            type: 'success'
                        })
                    } else {
                        this.$message({
                            message: res.data.message,
                            type: 'error'
                        })
                    }
                })
            }).catch(() => {})
        },
        refused() {
            this.$prompt('拒绝申请理由', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                inputPattern:  /\S/,
                inputErrorMessage: '请输入请输入拒绝申请理由'
            }).then(({ value }) => {
                if (value.length > 50) {
                    return this.$message({
                        type: 'error',
                        message: '拒绝申请理由最多50个字'
                    })
                }
                let params = {
                    status: this.row.status,
                    reason: value
                }
                this.refusedPost(this.row.id, params)
            }).catch(() => {});
        },
        refusedPost(id, params) {
            this.$axios.put(`/api/agent/${id}/audit_failed`, params).then(res => {
                if (res.data.code == 200) {
                    this.$emit('refresh')
                    this.is_show = false
                    this.$message({
                        type: 'success',
                        message: '拒绝申请成功'
                    })

                } else {
                    this.$message({
                        type: 'error',
                        message: res.data.message
                    })
                }
            })
        },
    }
}
</script>

<style lang="less" scoped>
/deep/.el-dialog {
    .el-dialog__body {
        padding: 10px 20px;
        .el-select {
            width: 100%;
        }
    }
}
</style>
